import React, { useContext } from "react";
import { View, StyleSheet, Dimensions, Text, TouchableOpacity, Image, ScrollView } from "react-native";
import { Divider } from "@rneui/themed";
import CommonContext from '@/utils/createContext'

const { width, scale } = Dimensions.get('window')
const ratio = width * scale / 1080

const AssetList = () => {

    const { safeAssetList, handlePressItem } = useContext(CommonContext)

    const onPressItem = (item) => {
        if (typeof (handlePressItem) === 'function') {
            handlePressItem(item)
        }
    }

    return (
        <ScrollView style={styles.container}>
            {safeAssetList ? safeAssetList.map((item, index) => {
                return (
                    <View key={index}>
                        <TouchableOpacity style={styles.itemContent} onPress={() => { onPressItem(item) }}>
                            <View style={{ flexDirection: 'row', justifyContent: 'center', alignItems: 'center' }}>
                                <Image source={{ uri: item.tokenInfo.logoUri }} style={styles.img} />
                                <Text style={{ ...styles.title, color: '#2C2C2C', marginLeft: 10 * ratio }}>{item.tokenInfo.name}</Text>
                            </View>
                            <Text style={{ ...styles.title, color: '#717171', marginRight: 15 * ratio }}>
                                {item.balance} {item.tokenInfo.symbol?.toUpperCase()}
                            </Text>
                        </TouchableOpacity>
                        <Divider color='#EFEFEF' />
                    </View>
                )
            }) : null}
        </ScrollView>
    )
}

const styles = StyleSheet.create({
    container: {
        flex: 1
    },
    itemContent: {
        flexDirection: 'row',
        width: width,
        height: 48 * ratio,
        justifyContent: 'space-between',
        alignItems: 'center'
    },
    img: {
        width: 23 * ratio,
        height: 23 * ratio,
        marginLeft: 15 * ratio
    },
    title: {
        fontSize: 14,
        fontFamily: 'SourceHanSansCN-Medium, SourceHanSansCN',
        fontWeight: '500',
        lineHeight: 21
    }
})
export default AssetList